/**
* 算法库
*/
<template>
  <div>
    <!-- 面包屑导航 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item >数据存储</el-breadcrumb-item>
    </el-breadcrumb>

    <div style="padding:5px;color:#000000;text-align: center;font-family:PingFang SC;font-size:30px">数据存储列表</div>

    <!-- 搜索筛选 -->
    <el-form :inline="true" :model="formInline" class="user-search">
      <el-form-item label="">
        <el-input size="small" placeholder="输入文件名"  @keyup.enter="getSearchPage" v-model="formInline.filename" ></el-input>
      </el-form-item>

      <el-form-item>
        <el-button size="small" type="primary" icon="el-icon-search" @click="getSearchPage">查询</el-button>
        <el-button size="small" type="info" icon="el-icon-refresh" @click="reset">重置</el-button>
      </el-form-item>
    </el-form>
    <!--列表-->
    <el-table size="small" @selection-change="selectChange" :data="resData" highlight-current-row v-loading="loading" border element-loading-text="拼命加载中" style="width: 100%;">
      <el-table-column align="center" type="selection" width="50">
      </el-table-column>

      <el-table-column align="center" sortable prop="id" v-if="false" label="序号" min-width="80">
      </el-table-column>
      <el-table-column align="center" sortable prop="taskId" label="任务ID" min-width="100">
      </el-table-column>
      <el-table-column align="center" prop="sourceId" v-if="false" label="数据源Id" min-width="200">
      </el-table-column>
      <el-table-column align="center" prop="filename" label="文件名" min-width="300">
      </el-table-column>
      <el-table-column align="center" prop="regexInfo" label="算法名" min-width="100">
      </el-table-column>
      <el-table-column align="center" prop="regexResult" label="处理结果" min-width="300">
      </el-table-column>
    </el-table>
    <!-- 分页组件 -->
    <Pagination v-bind:child-msg="pageparm" @callFather="callFather"></Pagination>


  </div>
</template>

<script>
  // 导入请求方法
  import {
    userList,
    userSave,
    userDelete,
    userPwd,
    userExpireToken,
    userFlashCache,
    userLock,
    UserDeptTree,
    UserDeptSave,
    UserDeptdeptTree,
    UserChangeDept, targetList
  } from '../../api/userMG'
  import Pagination from '../../components/Pagination'
  import axios from "axios";
  export default {
    inject:['reload'],
    data() {
      return {
        pageparm: {
          currentPage: 1,
          pageSize: 10,
          total: 10
        },
        loading: false, //是显示加载
        title: '添加条件内容',
        editFormVisible: false, //控制编辑页面显示与隐藏

        // 编辑与添加
        editForm: {
          id: '',
          example:'',
          token: localStorage.getItem('logintoken')
        },

        // rules表单验证
        rules: {
          id: [
            { required: true, message: '请输入序号', trigger: 'blur' }
          ],
          example: [
            { required: true, message: '请输入条件内容', trigger: 'blur' }
          ],
        },
        formInline: {
          page: 1,
          limit: 10,
          varLable: '',
          varName: '',
          token: localStorage.getItem('logintoken'),
          tagId: "",
          filename: '',
        },

        //返回数据列表
        resData: [],
        //搜索
        ruleForm: {
          regex_info: '',
          pageNum:'1',
          pageSize:'10',
        },

      }
    },
    // 注册组件
    components: {
      Pagination
    },

    /**
     * 数据发生改变
     */
    watch: {},

    /**
     * 创建完毕
     */
    created() {
      var data1 = localStorage.getItem('userName');
      var data2 = localStorage.getItem('pwd');
      var data3 = localStorage.getItem('userId');
      this.getSearchPage()

    },

    /**
     * 里面的方法只有被调用才会执行
     */
    methods: {

      // 获取数据方法
      getSearchPage(formInline) {
        this.logining = true
        let url = this.$global.javaUrl +"/storage/list"
        let config = {
          headers:
            {
              //'Content-Type':'application/json',
              'user' : localStorage.getItem('userId')
            },
          params:
            {
              fileName:this.formInline.filename,
              pageNum: this.formInline.page,
              pageSize:this.formInline.limit,

            }
        }
        axios.get(url, config).then(response=>{
          this.resData = response.data.data.rows
          this.pageparm.total=response.data.data.records
          console.log("response.data.data",response.data.data)
        })

      },
      reset() {
        this.formInline.page = 1
        this.formInline.regex_info = ""
        this.getSearchPage(this.formInline)
      },
      //显示编辑界面
      handleEdit: function(index, row) {
        this.editFormVisible = true
        if (row != undefined && row != 'undefined') {
          this.title = '修改条件内容'
          this.editForm.id = row.id
          this.editForm.example = row.example

        } else {
          this.title = '添加条件内容'
          this.editForm.id = row.id
          this.editForm.example = row.example
        }
      },
      // 编辑、添加提交方法
      submitForm(editData) {
        let config = {
          headers:
            {
              'Content-Type':'application/json',
              'user' : localStorage.getItem('userId')
            }
        }
        this.$refs[editData].validate(valid => {
          if (valid) {
            // 请求方法
            axios
              .post(this.$global.javaUrl +"/target/saveOrUpdate",this.editForm,config)
              .then(res => {
                this.editFormVisible = false
                this.loading = false
                this.pageparm.currentPage = this.formInline.page
                this.pageparm.pageSize = this.formInline.limit
                this.pageparm.total = res.data.data.records
                if (res.data.data != null) {
                  this.$message({
                    type: 'success',
                    message: "数据保存成功！"
                  })
                  this.getSearchPage()
                } else {
                  this.$message({
                    type: 'info',
                    message: res.msg
                  })
                }
              })
              .catch(err => {
                this.editFormVisible = false
                this.loading = false
                this.$message.error('保存失败，请稍后再试！')
              })
          } else {
            return false
          }
        })
      },

      // 关闭编辑、增加弹出框
      closeDialog(dialog) {
        if (dialog == 'edit') {
          this.editFormVisible = false
        } else if (dialog == 'perm') {
          this.dataAccessshow = false
        } else if (dialog == 'unit') {
          this.unitAccessshow = false
        }
      },

      deleteUser(id) {
        let config = {
          headers:
            {
              'Content-Type':'application/json',
              'user' : localStorage.getItem('userId')
            }
        }

        this.$confirm('确定要删除吗?', '信息', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(() => {
            // 删除
            axios.post(this.$global.javaUrl +"/target/delete",{'id':id},config)
              .then(res => {
                if (res.data.data !=null) {
                  this.$message({
                    type: 'success',
                    message: '数据已删除!'
                  })
                  this.getSearchPage()
                } else {
                  this.$message({
                    type: 'info',
                    message: "1111"
                  })
                }
              })
              .catch(err => {
                this.loading = false
                this.$message.error('数据删除失败，请稍后再试！')
              })
            this.getSearchPage()
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: '已取消删除！'
            })
          })
      },
      callFather(parm) {
        this.formInline.page = parm.currentPage
        this.formInline.limit = parm.pageSize
        this.getSearchPage()
      },
    }
  }
</script>

<style scoped>
  .user-search {
    margin-top: 20px;
  }
  .userRole {
    width: 100%;
  }
</style>

